<template>
  <div class="planeBox">
    <!--  <div class="item">
      <span class="itemtimes">今日拦截次数 :</span>
      <span class="itemtext">{{ list.todayAntiTimes || 0 }}</span>
    </div>
    <div class="item">
      <span class="itemtimes">累计发现无人机 :</span
      ><span class="itemtext">{{ list.totalDroneDev || 0 }}</span>
    </div>
    <div class="item">
      <span class="itemtimes">今日入侵架次 :</span
      ><span class="itemtext">{{ list.todayIntruTimes || 0 }}</span>
    </div>
    <div class="item">
      <span class="itemtimes">白名单 :</span
      ><span class="itemtext">{{ list.totalWhitelistDev || 0 }}</span>
    </div>

    <div class="item">
      <span class="itemtimes">累计拦截次数 :</span
      ><span class="itemtext">{{ list.totalIntruTimes || 0 }}</span>
    </div>-->
    <div class="flex1 flex_between">
      <TIPS :title="'今日拦截次数'" :data="list.todayAntiTimes || 0" />
      <TIPS :title="'今日入侵架次'" :data="list.todayIntruTimes || 0" />
    </div>
    <div class="flex1 flex_between">
      <TIPS :title="'累计拦截次数'" :data="list.totalIntruTimes || 0" />
      <TIPS :title="'累计发行无人机'" :data="list.totalDroneDev || 0" />
      <TIPS :title="'白名单'" :data="list.totalWhitelistDev || 0" />
    </div>
  </div>
</template>
<script>
import TIPS from "components/tips";
export default {
  props: {
    list: Object,
  },
  components: {
    TIPS,
  },
  data() {
    return {};
  },
};
</script>
<style lang="scss" scoped>
.planeBox {
  color: #fff;
  margin-top: -2vh;
}
.flex {
  display: flex;
  flex-wrap: wrap;
}
.flex1 {
  display: flex;
}
.flex_between {
  justify-content: space-between;
}
.flex_around {
  justify-content: space-around;
}
.planeBox .item {
  padding-top: 1vh;

  font-size: 0.93vh;
}
.planeBox .item span {
  display: inline-block;
}
.planeBox .item .itemtext {
  color: #03f2fb;
  padding-left: 1.46vw;
}
.planeBox .item .itemtimes {
  width: 30%;
}
</style>
